<template>
	<div class="app-contain bg-f3f5f7">
		<head-top></head-top>
		<div class="nxb-box">
			<article class="uc-m-content pt50 paper-result">
				<div class="i-box mt20 border">
					<section class="plan-info-box">
						<h3 class=""> <span class="c-333 fsize20 vam">{{resultData.paperName}}</span>  </h3>
						<section class="c-666 mt10 fsize14 clearfix"> <span class="fl">交卷时间：{{resultData.updatetime}}</span> <span class="fsize24 pl20 c-blue1 fr" v-if="resultData.pass">及格</span> <span class="fr fsize24 pl20 c-red" v-else>不及格</span></section>
					</section>
				</div>
				<div class="i-box mt20 u-plan-wrap">
	
					<div class="clearfix of credit-box mb10">
						<div class="col-60">
							<div class="ml5">
								<p class="fsize14 c-666 ">答题用时：<span class="c-master fsize24">{{countdowm(resultData.time)}}</span></p>
								<p class=" fsize14 c-666 mt20">答对题数：<span class=" c-red fsize24">{{resultData.correctNum}}/{{resultData.questionCount}}</span></p>
							</div>
						</div>
						<div class=" col-40 ml40 tac">
							<p class="fsize18 c-666 ">分数</p>
							<ul class="career-attr-list mt20 clearfix of">
								<li>
									<p class=" hLh30 f-fG fsize28"><span class="fsize54 c-blue1">{{resultData.score}}</span> </p>
									<a href="javascript:;" class="look" @click="lookRecord">查看解析</a>
								</li>
							</ul>
						</div>
					</div>
				</div>
			</article>
		</div>
		
		<foot-bootom></foot-bootom>
	</div>
</template>

<script>
	import headTop from '@/components/header/header'
	import footBootom from '@/components/footer/index'
	import { getExamReport } from '@/api/exam'
	export default {
		name: 'result',
		data() {
			return {
				resultData: {}
			}
		},
		components: { //引入组件
			headTop,
			footBootom

		},
		computed: {
			userInfo() {
				return this.$store.getters.getStorageInfo;
			}
		},
		created() {
			let query = this.$route.query;
			let data = {
				userId: this.userInfo.id,
				examId: query.examId,
				type: query.type
			}
			this.getExamReport(data)
		},
		methods: {
			getExamReport(data) {
				getExamReport(data).then((res) => {
					this.resultData = res.entity;
				})
			},
			countdowm(timestamp) { //转换时间格式   
				let self = this;   
				var numberSeconds = Number(timestamp);         
					     
					if(numberSeconds<60) {
						return  numberSeconds+'秒'; 
						let format = '';    
			         	    
						
					}else{
						let format = '';    
			         	var minutes = Math.floor(numberSeconds/60);
            			var second = Math.floor(numberSeconds%60);
						format = ""+minutes+"分"+second+"秒";  
						return format;   
					}     
			},
			lookRecord(){
				this.$router.push({
					path: '/examRecord',
					query: {
						paperId:this.resultData.paperId,
						examRecordId:this.resultData.id
					}
				})
			}
		}
	}
</script>

<style scoped>
	body,
	html {
		width: 100%;
		height: 100%;
		background: #000;
	}
	
	.paper-result {
		padding: 30px;
		width: 50%;
		margin: 0 auto 0 auto;
	}
	
	.border {
		border: 1px solid #d2d2d2;
	}
	.look{
			margin-top: 30px;
		    border: 1px solid #a4d6fd;
		    border-radius: 20px;
		    color: #31a4ff;
		    text-align: center;
		    font-size: 14px;
		    display: inline-block;
		    height: 28px;
		    width: 90px;
		    line-height: 28px;
	}
</style>